import React from 'react';
import { Table, Modal, Tabs, Button, Icon, Radio,Form } from 'antd';
import moment from 'moment';
import { userId } from '@/constant';
import {connect } from 'dva'

import TableData from './TableData';
import ChartData from './ChartData'
import WeekData from './weekData';

const creator=(type,payload)=>({type,payload})
const { TabPane } = Tabs;
class Achievement extends React.Component {
  state = {
    value: '所有',
  };
  componentDidMount() {
    // const { dispatch } = this.props;
    // const id = window.sessionStorage.getItem(userId);
    // let sDate = moment('0000-01-01');
    // let eDate = moment('9999-12-31');
    // dispatch(creator('plan/getAchievementList', { id, sDate, eDate,type:'all' }));
  }
  handleCancel = e => {
    const { toggleAchievement } = this.props;
    toggleAchievement();
  };

  handleSizeChange = e => {
    this.setState({ value: e.target.value });
  };
  //获取成就记录
  getAchievementList=(type)=>{
    const { dispatch } = this.props;
    const id = window.sessionStorage.getItem(userId);
    let sDate = moment();
    let eDate = moment();
    if(type==='all'){
        sDate = moment('0000-01-01');
        eDate = moment('9999-12-31');
    }else if(type==='week'){
        sDate =moment().startOf('week');
        eDate = moment().endOf('week');

    }else if(type==='month'){
        sDate =moment().startOf('month');
        eDate = moment().endOf('month');
    }else if(type==='year'){
        sDate =moment().startOf('year');
        eDate = moment().endOf('year');
    }
    dispatch(creator('plan/getAchievementList', { id, sDate, eDate,type }));
  }
  render() {
    const { visible } = this.props;
    const {achievementList}=this.props.plan;
    return (
      <Modal
        title="成就记录"
        visible={visible}
        onCancel={this.handleCancel}
        width={900}
        footer={null}
      >
        <Tabs>
          <TabPane
            tab={
              <span>
                <Icon type="table" />
                表格
              </span>
            }
            key="1"
          >
            <TableData />
          </TabPane>
          <TabPane
            tab={
              <span>
                <Icon type="line-chart" />
                折线图
              </span>
            }
            key="2"
          >
            <ChartData />
          </TabPane>
          <TabPane
            tab={
              <span>
                <Icon type="pie-chart" />
                饼图
              </span>
            }
            key="3"
          >
            <WeekData />
          </TabPane>
          
        </Tabs>
        <Radio.Group onChange={this.handleSizeChange} style={{ marginTop: 10 }}>
          <Radio.Button value="所有" onClick={this.getAchievementList.bind(this,'all')}>所有</Radio.Button>
          <Radio.Button value="本周" onClick={this.getAchievementList.bind(this,'week')}>本周</Radio.Button>
          <Radio.Button value="本月" onClick={this.getAchievementList.bind(this,'month')}>本月</Radio.Button>
          <Radio.Button value="本年" onClick={this.getAchievementList.bind(this,'year')}>本年</Radio.Button>
        </Radio.Group>
      </Modal>
    );
  }
}

const WrappedAchievement = Form.create({ name: 'plan' })(Achievement);

export default connect(({ plan, loading }) => ({ plan, loading: loading.models.plan }))(
  WrappedAchievement,
);
